<template>
  <div>
    <listItemCom
      :musicList="list"
      :totalNums="totalRow"
      :noDate="lastPage"
      @addDataBtn="handelAddDataBtn"
      @removeItem="deleItemBtn"
    ></listItemCom>
  </div>
</template>

<script>
import controller from "@/components/controllers/controllers";
import listItemCom from "../PersonalMusic/listItemCom";
export default {
  name: "MyDownloads",
  components: {
    listItemCom,
  },
  data() {
    return {
      list: [],
      lastPage: false,
      pageNumber: 1,
      totalRow: null,
    };
  },
  mounted() {
    this.getDownloadList();
  },
  methods: {
    // 获取下载列表数据
    getDownloadList() {
      let that = this;
      controller
        .downloadList({
          page: that.pageNumber,
          token: localStorage.getItem("token"),
        })
        .then((res) => {
          console.log("获取下载列表数据", res);
          res.baseData.list.forEach((item) => {
            // 用于子组件
            item.commonId = item.downloadId;
          });
          this.list = that.list.concat(res.baseData.list);
          this.lastPage = res.baseData.lastPage;
          this.pageNumber = res.baseData.pageNumber;
          this.totalRow = res.baseData.totalRow;
        });
    },
    // 接收子组件传来的页面参数
    handelAddDataBtn(nums) {
      console.log("handelAddDataBtn", nums);
      this.pageNumber++;
      this.getDownloadList();
    },
    // 取消下载
    deleItemBtn(ids) {
      let that = this;
      console.log("取消下载", ids);
      controller
        .delDownload({
          ids,
        })
        .then((res) => {
          console.log(res);
          that.pageNumber = 1;
          that.list = [];
          that.getDownloadList();
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
};
</script>
<style lang='' scoped>
</style>